<template>
  <div>
    <table
      v-loading="listLoading"
      :data="studentinfo"
      element-loading-text="Loading"
      border
      fit
      highlight-current-row
      borderclor="black"
      cellpadding="10"
      frame="box"
      cellspacing="0"
      align="center"
    >
      <caption style="font-size:30px;">2020级计算机科学与技术学院详细信息表</caption>
      <tr>
        <td>姓名</td>
        <td class="table" v-bind="items">
          {{ items.name }}
        </td>
        <td>性别</td>
        <td class="table" v-bind="items">
          {{ items.sex }}
        </td>
        <td rowspan="4">
          <img :src="items.images" v-bind="items" alt="" width="100px">
        </td>

      </tr>
      <tr>
        <td>民族</td>
        <td v-bind="items">
          {{ items.nation }}
        </td>
        <td>出生年月</td>
        <td v-bind="items">
          {{ items.birthday }}
        </td>

      </tr>
      <tr>
        <td>专业班级</td>
        <td v-bind="items">
          {{ items.classes }}
        </td>
        <td>政治面貌</td>
        <td v-bind="items">
          {{ items.polica }}
        </td>

      </tr>
      <tr>
        <td>联系方式</td>
        <td v-bind="items">
          {{ items.phone }}
        </td>
        <td>健康状况</td>
        <td v-bind="items">
          {{ items.fitness }}
        </td>

      </tr>
      <tr>
        <td>身份证号</td>
        <td colspan="4" align="center" v-bind="items">
          {{ items.idnum }}
        </td>
      </tr>
      <tr>
        <td>现家庭住址</td>
        <td colspan="4" align="center" v-bind="items">
          {{ items.address }}
        </td>

      </tr>

      <tr>
        <td colspan="5" align="center">家庭成员或监护人信息（一）</td>
      </tr>
      <tr>
        <td>姓名</td>
        <td v-bind="items">
          {{ items.fir_name }}
        </td>
        <td>性别</td>
        <td colspan="2" v-bind="items">
          {{ items.fir_sex }}
        </td>
      </tr>
      <tr>
        <td>关系</td>
        <td v-bind="items">
          {{ items.fir_relationship }}
        </td>
        <td>民族</td>
        <td colspan="2" v-bind="items">
          {{ items.fir_nation }}
        </td>
      </tr>
      <tr>
        <td>联系方式</td>
        <td v-bind="items">
          {{ items.fir_phone }}
        </td>
        <td>政治面貌</td>
        <td colspan="2" v-bind="items">
          {{ items.fir_polica }}
        </td>
      </tr>
      <tr>
        <td>工作单位</td>
        <td v-bind="items">
          {{ items.fir_placeofwork }}
        </td>
        <td>身份证号码</td>
        <td colspan="2" v-bind="items">
          {{ items.fir_idnum }}
        </td>
      </tr>
      <tr>
        <td>现家庭住址</td>
        <td colspan="4" align="center" v-bind="items">
          {{ items.fir_address }}
        </td>

      </tr>
      <tr>
        <td colspan="5" align="center">家庭成员或监护人信息（二）</td>
      </tr>
      <tr>
        <td>姓名</td>
        <td v-bind="items">
          {{ items.sec_name }}
        </td>
        <td>性别</td>
        <td colspan="2" v-bind="items">
          {{ items.sec_sex }}
        </td>
      </tr>
      <tr>
        <td>关系</td>
        <td v-bind="items">
          {{ items.sec_relationship }}
        </td>
        <td>民族</td>
        <td colspan="2" v-bind="items">
          {{ items.sec_nation }}
        </td>
      </tr>
      <tr>
        <td>联系方式</td>
        <td v-bind="items">
          {{ items.sec_phone }}
        </td>
        <td>政治面貌</td>
        <td colspan="2" v-bind="items">
          {{ items.sec_polica }}
        </td>
      </tr>
      <tr>
        <td>工作单位</td>
        <td v-bind="items">
          {{ items.sec_placeofwork }}
        </td>
        <td>身份证号码</td>
        <td colspan="2" v-bind="items">
          {{ items.sec_idnum }}
        </td>
      </tr>
      <tr>
        <td>现家庭住址</td>
        <td colspan="4" align="center" v-bind="items">
          {{ items.sec_address }}
        </td>

      </tr>
      <tr>
        <td>第三方联系人</td>
        <td colspan="1" v-bind="items">
          {{ items.thrid_name }}
        </td>
        <td>联系方式</td>
        <td colspan="2" v-bind="items">
          {{ items.thrid_phone }}
        </td>
      </tr>

      <tr>
        <td colspan="5" align="center"> 奖惩情况</td>

      </tr>
      <tr>
        <td colspan="5" v-bind="items">
          {{ items.reandpu }}
        </td>
      </tr>
      <tr>
        <td colspan="5" align="center"> 特殊情况</td>

      </tr>
      <tr>
        <td colspan="5" v-bind="items">
          {{ items.exceptional }}
        </td>
      </tr>
    </table>
  </div>
</template>

<script>
import { getStudentInfo } from '@/api/studentinfo'

export default {
  data() {
    return {
      listLoading: true,
      studentid: '',
      studentinfo: null,
      items: ''
    }
  },
  mounted() {
  },
  created() {
    this.studentid = this.$route.params.studentid
    this.fetchData()
  },
  methods: {
    fetchData() {
      this.listLoading = true
      getStudentInfo(this.studentid).then(response => {
        this.items = response.data.items[0]
        console.log(this.items)
        this.listLoading = false
      })
    }
  }
}
</script>

<style lang="scss" scoped>

.table {
    width: 170px;
}

</style>

